<template>
  <div class="wrapper">
    <div class="container">
      <div class="login-form">
        <el-row>
          <el-col :span="24">
            <h2 class="checked">帐号登录</h2>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-input v-model="input" placeholder="请输入用户名"></el-input>

          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-input placeholder="请输入密码" v-model="input" show-password></el-input>

          </el-col>
        </el-row>

        <el-row>
          <el-button type="primary">立即登录</el-button>

        </el-row>
        <el-row class="tips">
          <el-col :span="24">
            <span>立即注册</span> | <span>忘记密码</span>
          </el-col>

        </el-row>

        <el-row>
          <!--          <el-divider></el-divider>-->
          <!--          微信-->

        </el-row>

      </div>
    </div>
  </div>
</template>

<script>


export default {
  name: "login",
  layout: "login",
  components: {}
}
</script>

<style scoped lang="scss">
.wrapper {
  background: url('static/login-bg.jpg') no-repeat center;

  .container {
    width: 1200px;
    height: 576px;
    margin: 0 auto;
    text-align: center;

    .login-form {
      .el-row {
        margin: 30px 0;

        .el-divider {
          width: 280px;

        }
      }

      width: 400px;
      height: 500px;
      float: right;
      background-color: #FFFFFF;
      margin-top: 30px;

      .checked {
        text-align: center;
      }

      .el-input {
        width: 300px;
      }

      .tips {
        font-size: 12px;
        color: #999;

      }

      .el-button {
        width: 300px;
        border: none;
        background: #13D1BE;
        font-size: 16px;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        vertical-align: -1px;

        i {
          font-weight: bold;
        }
      }


    }

  }
}

</style>
